{extend name="common/index"}
{block name="css"}
<link rel="stylesheet" href="__STATIC__/plugins/layui_formSelects/formSelects-v4.css">
<link rel="stylesheet" href="__STATIC__/plugins/web_font/jquery.cxcolor-1.2/css/jquery.cxcolor.css">
<style>
    .font-set {margin-top: 5px;}
    .font-set select{height: 22px;}
    .detail-image, .area-image {
        padding: 0;
    }
    .detail-image .image-text, .area-image .image-text {
        margin-top: 90px;
    }
    .detail-image, .area-image, .detail-image img, .area-image img {
        height: 280px;
        width: 100%;
    }

    {empty name="data.img_url"}
    .image-url .image-preview {display: none;}/*隐藏图片*/
    {else/}
    .image-url .image-text {display: none;}/*隐藏文字*/
    {/empty}
    {empty name="data.detail_img"}
    .detail-image .image-preview {display: none;}/*隐藏图片*/
    {else/}
    .detail-image .image-text {display: none;}/*隐藏文字*/
    {/empty}
    {empty name="data.area_img"}
    .area-image .image-preview {display: none;}/*隐藏图片*/
    {else/}
    .area-image .image-text {display: none;}/*隐藏文字*/
    {/empty}
</style>
{/block}

{block name="content"}
<div class="layui-row">
    <form id="editForm" class="layui-form" action="">
        <input type="hidden" name="goods_id" id="goods_id" value="{$data.goods_id|default=''}">
        <div class="layui-field-box">
            <div class="layui-main">
                <div class="layui-form-item">
                    <label class="layui-form-label">主图：<br>(800*800)</label>
                    <div class="layui-input-block image-url">
                        <div class="layui-upload-drag">
                            <div class="image-text">
                                <i class="layui-icon layui-icon-upload"></i>
                                <p>点击上传，或将文件拖拽到此处</p>
                            </div>
                            <div class="image-preview">
                                <input type="hidden" name="img_url" value="{$data.img_url|default=''}" data-id="{$data.goods_id|default=''}" data-table="goods">
                                <img src="{$data.img_url|default=''}" alt="图片">
                                <div class="tools tools-bottom">
                                    <a href="javascript:void(0);" onclick="delImgAjax(this);">
                                        <i class="layui-icon layui-icon-delete"></i>
                                    </a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">系列：</label>
                    <div class="layui-input-block">
                        <select name="cat_id">
                            <option value="">请选择</option>
                            {$seriesList}
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">国家：</label>
                    <div class="layui-input-block">
                        <select name="country">
                            <option value="">请选择</option>
                            {$countryList}
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label"><span style="color: red;">*&nbsp;</span>产品名称：</label>
                    <div class="layui-input-block">
                        <input type="text" id="font_sample" name="goods_name" value="{$data.goods_name|default=''}" lay-verify="required" class="layui-input"
                               style='{$data.goods_name_style|default=""}'/>
                        <input type="hidden" name="goods_name_style" value="{$data.goods_name_style|default=''}">
                        <div class="font-set">
                            <select id="font_list" lay-ignore></select>
                            <select id="font_size_select" lay-ignore></select>
                            <input id="font_bold" type="checkbox" lay-ignore>粗体
                            <input id="font_italic" type="checkbox" lay-ignore>斜体
                            <input id="font_color" type="text" class="input_cxcolor" readonly="">
                        </div>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">产品简称：</label>
                    <div class="layui-input-block">
                        <input type="text" name="short_name" value="{$data.short_name|default=''}" maxlength="10" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">产品价格：</label>
                    <div class="layui-input-block">
                        <input type="number" name="price" value="{$data.price|default=''}" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">产品年份：</label>
                    <div class="layui-input-block">
                        <select name="years">
                            <option value="">请选择</option>
                            {$yearsList}
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">产品酒标：</label>
                    <div class="layui-input-block">
                        <input type="text" name="wine_label" value="{$data.wine_label|default=''}" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">产品产区：</label>
                    <div class="layui-input-block">
                        <input type="text" name="area" value="{$data.area|default=''}" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">产品风格：</label>
                    <div class="layui-input-block">
                        <input type="text" name="goods_style" value="{$data.goods_style|default=''}" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">食物搭配：</label>
                    <div class="layui-input-block">
                        <input type="text" name="food_mix" value="{$data.food_mix|default=''}" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">购买链接：</label>
                    <div class="layui-input-block">
                        <input type="text" name="buy_url" value="{$data.buy_url|default=''}" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">扩展类目：</label>
                    <div class="layui-input-block">
                        <select name="cat_id_ext" xm-select="cat-id-ext">
                            <option value="">请选择</option>
                            {$catExtList}
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">关键字：</label>
                    <div class="layui-input-block">
                        <input type="text" name="keywords" value="{$data.keywords|default=''}" class="layui-input">
                        <span style="color: #FFB800;">用于seo搜索优化</span>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">产品排序：</label>
                    <div class="layui-input-block">
                        <input type="number" name="sort_num" value="{$data.sort_num|default='1'}" placeholder="数字越小，越靠前" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">是否发布：</label>
                    <div class="layui-input-block">
                        <input type="radio" name="state" value="1" title="是" lay-filter="changeState" {eq name="data.state|default='1'" value="1" }checked{/eq}>
                        <input type="radio" name="state" value="0" title="否" lay-filter="changeState" {eq name="data.state|default='1'" value="0" }checked{/eq}>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">定时发布：</label>
                    <div class="layui-input-block">
                        <input type="text" name="public_time" id="public_time" value="{$data.public_date_hh_ii_ss|default=''}" class='layui-input'>
                        <span style="color: #FFB800;">发布状态为“否”时，按该时间定时发布 </span>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">推荐等级：</label>
                    <div class="layui-input-block">
                        {volist name="levelList" id="vo"}
                        <input type="radio" name="level" value="{$vo.basic_id}" title="{$vo.basic_name}" {eq name="vo.basic_id" value="$data.level|default='175'" }checked{/eq}>
                        {/volist}
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">描述简介：</label>
                    <div class="layui-input-block">
                        <textarea name="describe" class="layui-textarea">{$data.describe|default=''}</textarea>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">详情简介：<br>(360*270)&nbsp;&nbsp;</label>
                    <div class="layui-input-block layui-col-space10">
                        <div class="layui-col-xs12 layui-col-sm12 layui-col-md12 layui-col-lg4">
                            <div class="layui-upload-drag detail-image">
                                <div class="image-text">
                                    <i class="layui-icon layui-icon-upload"></i>
                                    <p>点击上传，或将文件拖拽到此处</p>
                                </div>
                                <div class="image-preview">
                                    <input type="hidden" name="detail_img" value="{$data.detail_img|default=''}" data-id="{$data.goods_id|default=''}" data-table="goods">
                                    <img src="{$data.detail_img|default=''}" alt="图片">
                                    <div class="tools tools-bottom">
                                        <a href="javascript:void(0);" onclick="delImgAjax(this);">
                                            <i class="layui-icon layui-icon-delete"></i>
                                        </a>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="layui-col-xs12 layui-col-sm12 layui-col-md12 layui-col-lg8">
                            <!-- 加载编辑器的容器 -->
                            <script id="detail-text" name="detail" type="text/html">{$data.detail|default=''}</script>
                        </div>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">区域简介：<br>(360*270)&nbsp;&nbsp;</label>
                    <div class="layui-input-block layui-col-space10">
                        <div class="layui-col-xs12 layui-col-sm12 layui-col-md12 layui-col-lg4">
                            <div class="layui-upload-drag area-image">
                                <div class="image-text">
                                    <i class="layui-icon layui-icon-upload"></i>
                                    <p>点击上传，或将文件拖拽到此处</p>
                                </div>
                                <div class="image-preview">
                                    <input type="hidden" name="area_img" value="{$data.area_img|default=''}" data-id="{$data.goods_id|default=''}" data-table="goods">
                                    <img src="{$data.area_img|default=''}" alt="图片">
                                    <div class="tools tools-bottom">
                                        <a href="javascript:void(0);" onclick="delImgAjax(this);">
                                            <i class="layui-icon layui-icon-delete"></i>
                                        </a>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="layui-col-xs12 layui-col-sm12 layui-col-md12 layui-col-lg8">
                            <!-- 加载编辑器的容器 -->
                            <script id="area-detail" name="area_detail" type="text/html">{$data.area_detail|default=''}</script>
                        </div>

                    </div>
                </div>
            </div>
            <div class="tpl-form-action">
                <button class="layui-btn layui-btn-radius layui-btn-lg" lay-submit lay-filter="formSubmit">保存</button>
            </div>
        </div>
    </form>
</div>
{/block}

{block name="script"}
<script type="text/javascript" src="__STATIC__/plugins/ueditor/ueditor.config.js"></script><!-- 编辑器配置文件 -->
<script type="text/javascript" src="__STATIC__/plugins/ueditor/ueditor.all.min.js"></script><!-- 编辑器源码文件 -->
<script type="text/javascript" src="__STATIC__/plugins/layui_formSelects/formSelects-v4.js"></script>
<script type="text/javascript" src="__STATIC__/plugins/web_font/jquery.cxcolor-1.2/jquery.cxcolor.js"></script>
<script type="text/javascript" src="__STATIC__/plugins/web_font/swfobject-2.2.min.js"></script>
<script type="text/javascript" src="__STATIC__/plugins/web_font/init.js"></script>

<script type="text/javascript">
    layui.use(['form', 'laydate'], function () {
        var form = layui.form;
        var laydate = layui.laydate;

        //实例化时间插件
        laydate.render({elem: '#public_time', type: 'datetime'});

        //上传图片
        uploadImgAjax('.image-url', '{:url("uploadImg")}', 4096);//大图
        uploadImgAjax('.detail-image', '{:url("uploadImg")}', 4096);//详情左图
        uploadImgAjax('.area-image', '{:url("uploadImg")}', 4096);//区域左图

        //监听提交
        form.on('submit(formSubmit)', function (data) {
            var index = layer.load(2, {shade: [0.5, '#000'], time: 10 * 1000});
            var dom_from = $('#editForm');
            var name_style = dom_from.find('input[name="goods_name"]').attr('style');
            dom_from.find('input[name="goods_name_style"]').val(name_style);
            $.post('{:url("save")}', dom_from.serialize(), function (result) {
                layer.close(index);
                if (result.code) {
                    layer.msg(result.msg, {shade: [0.5, '#000'], time: 1000}, function () {
                        window.location.href = result.url;
                    });
                } else {
                    layer.alert(result.msg, {icon: 2, title: '保存失败！'});
                }
            }, 'json');
            return false;
        });
    });

    //实例化编辑器
    var editor_config = {
        toolbars: [
            ['fullscreen', 'source', '|', 'undo', 'redo', 'pasteplain', '|',
                'bold', 'italic', 'underline', '|', 'forecolor', 'backcolor', 'insertorderedlist',
                'fontfamily', 'fontsize', '|',
                'justifyleft', 'justifycenter', 'justifyright', 'justifyjustify'
            ]
        ],
        initialFrameHeight: 226,
        autoHeightEnabled: false
    };
    UE.getEditor('detail-text', editor_config);
    UE.getEditor('area-detail', editor_config);
</script>
{/block}